<@override name="contest_content">

<div class="row">
  <div class="span6 offset4 text-center">
    <ul class="nav nav-pills">
      <#list contestProblems as Problem>
      <li class="<#if problem.id==Problem.id>active</#if>">
      <a href="contest/problem/${cid}-${Problem.id}" data-toggle="tooltip" data-placement="bottom" title="${Problem.title} (${Problem.accepted}/${Problem.submission})">${Problem.id}</a>
      </li>
      </#list>
    </ul>
  </div>
</div>

<div class="text-center">
  <h2>
    <#if userResult??>
    <image src="assets/images/<#if userResult==0>accepted.gif<#else>wrong.gif</#if>" />
    </#if> 
    <span class="black">${problem.id!}:</span>
    <#if adminUser??> 
    <a href="problem/show/${problem.pid!}" data-toggle="tooltip" title="Problem ${problem.pid!}" target="_blank">${problem.title!}</a>
    <#else>
    ${problem.title!} 
    </#if> 
    <#if spj?? && spj><span class="badge badge-important">SPJ</span><br></#if>
  </h2>
  <#if adminUser??>
  <a href="contest/editProblem/${cid!}-${problem.id!}?ajax=1" data-toggle="modal" data-target="#editModal" class="btn btn-primary">Edit</a> 
  <a href="#" class="btn btn-danger">Rejudge</a><br>
  </#if> 
  Time Limit: <span class="blue">${problem.timeLimit!} MS</span> 
  Memory Limit: <span class="blue">${problem.memoryLimit!} KB</span><br>
  Total Submit: <a href="contest/status/${cid!}?pid=${problem.id!}">${problem.submission!}</a> 
  Accepted: <a href="contest/status/${cid!}?pid=${problem.id!}&result=0">${problem.accepted!}</a>
  Page View: <span class="blue">${problem.view!}</span><br> 
  <#if cstatus?? && cstatus==1> 
  <a href="<#if user??>contest/submit/${cid!}-${problem.id!}?ajax=1</#if>" class="btn btn-info" data-toggle="modal" data-target="<#if user??>#submitModal<#else>#loginModal</#if>">Submit</a>
  </#if> 
  <a href="contest/problemStatus/${cid!}-${problem.id!}" class="btn btn-info">Status</a>
  <a href="contest/clarify/${cid!}-${problem.id!}" class="btn btn-info">Clarify</a>
</div>

<#if adminUser??>
<div class="modal hide fade problemModal" id="editModal">
  <form class="" action="contest/updateProblem" id="editPorblemForm" method="post">
    <div class="modal-header">
      <button class="close" aria-hidden="true" data-dismiss="modal" type="button">×</button>
      <h3 id="editModalLabel">
        Edit Problem ${cid!}-${problem.id!}:
        <a href="contest/editProblem/${cid!}-${problem.id!}" title="Edit in another page" data-toggle="tooltip" data-placement="bottom">${problem.title!}</a>
      </h3>
    </div>
    <div class="modal-body">
      <a href="contest/editProblem/${cid!}-${problem.id!}" class="btn btn-primary">Edit</a>
    </div>
    <div class="modal-footer">
      <button type="submit" class="btn btn-primary">Save</button>
      <button type="reset" class="btn btn-info">Reset</button>
      <button class="btn" data-dismiss="modal">Cancel</button>
    </div>
  </form>
</div>
</#if> 
<#if user??>
<div class="modal hide fade problemModal" id="submitModal">
  <form class="" id="submitForm" action="contest/submitSolution" method="post">
    <div class="modal-header">
      <button class="close" aria-hidden="true" data-dismiss="modal" type="button">×</button>
      <h3 id="submitModalLabel">
        Submit Problem ${cid!}-${problem.id!}:<a href="contest/submit/${cid!}-${problem.id!}" title="Submit in another page" data-toggle="tooltip"
          data-placement="bottom">${problem.title!}</a>
      </h3>
    </div>
    <div class="modal-body">
      <a href="contest/submit/${cid!}-${problem.id!}" class="btn btn-primary">Submit</a>
    </div>
    <div class="modal-footer">
      <div class="pull-left">
        <p class="text-error" id="error"></p>
      </div>
      <button type="submit" id="Submit" class="btn btn-primary" accesskey="s">Submit</button>
      <button class="btn" data-dismiss="modal" accesskey="x">Cancel</button>
    </div>
  </form>
</div>
</#if>

<section id="s-description">
  <div class="page-header">
    <h4>Description</h4>
  </div>
  <div class="content" id="description">
    <pre>${problem.description!}</pre>
  </div>
</section>

<section id="s-input">
  <div class="page-header">
    <h4>Input</h4>
  </div>
  <div class="content" id="input">
    <pre>${problem.input!}</pre>
  </div>
</section>

<section id="s-output">
  <div class="page-header">
    <h4>Output</h4>
  </div>
  <div class="content" id="output">
    <pre>${problem.output!}</pre>
  </div>
</section>

<section id="s-sampleInput">
  <div class="tabbable content" id="sampleInput">
    <ul class="nav nav-tabs">
      <li class="active"><a href="#tab1" data-toggle="tab"><strong>Sample Input</strong></a></li>
      <li><a href="#tab2" data-toggle="tab">Raw</a></li>
    </ul>
    <div class="tab-content">
      <div class="tab-pane active" id="tab1">
        <pre>${problem.sampleInput!}</pre>
      </div>
      <div class="tab-pane" id="tab2">
        <textarea id="sampleInput" class="auto-width" rows="${problem.sample_input_rows!12}" cols="185">${problem.sampleInput!}</textarea>
      </div>
    </div>
  </div>
</section>

<section id="s-sampleOutput">
  <div class="tabbable content" id="sampleOutput">
    <ul class="nav nav-tabs">
      <li class="active"><a href="#tab3" data-toggle="tab"><strong>Sample Output</strong></a></li>
      <li><a href="#tab4" data-toggle="tab">Raw</a></li>
    </ul>
    <div class="tab-content">
      <div class="tab-pane active" id="tab3">
        <pre>${problem.sampleOutput!}</pre>
      </div>
      <div class="tab-pane" id="tab4">
        <textarea id="sampleOutput" class="auto-width" rows="${problem.sample_output_rows!12}" cols="185">${problem.sampleOutput!}</textarea>
      </div>
    </div>
  </div>
</section>

<#if problem.hint?? && problem.hint!="">
<section id="s-hint">
  <div class="page-header">
    <h4>Hint</h4>
  </div>
  <div class="content" id="hint">
    <pre>${problem.hint!}</pre>
  </div>
</section>
</#if>

<#if adminUser??>
<section id="s-source">
  <div class="page-header">
    <h4>Source</h4>
  </div>
  <div class="content" id="source">
    <pre><a href="problem/search?word=${problem.source!}&scope=source" data-toggle="tooltip" title="Search other problems">${problem.source!}</a></pre>
  </div>
</section>

<#if tagList??>
<section id="s-tag">
  <div class="page-header">
    <h4>Tag</h4>
  </div>
  <div class="content" id="tag">
    <pre><#list tagList as Tag><a href="problem/search?word=${Tag.tag!}&scope=tag" title="${Tag.name!}" data-toggle="tooltip">${Tag.tag!}</a> </#list></pre>
  </div>
</section>
</#if>
</#if>

<div class="text-center">
  <#if cstatus?? && cstatus==1> 
  <a href="<#if user??>contest/submit/${cid!}-${problem.id!}?ajax=1</#if>" class="btn btn-info" data-toggle="modal" data-target="<#if user??>#submitModal<#else>#loginModal</#if>">Submit</a>
  </#if> 
  <a href="contest/problemStatus/${cid!}-${problem.id!}" class="btn btn-info">Status</a>
  <a href="contest/clarify/${cid!}-${problem.id!}" class="btn btn-info">Clarify</a>
</div>

</@override>
<@override name="scripts">
  <script type="text/javascript">
    $(document).ready(function() {
      jQuery.ajaxSetup({
        cache: true
      });
    });
  </script>
</@override>
<@extends name="_layout.html" />
